<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/Strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
  <title>FreeGroup Draw2D 0.9.26 :: ToggleButton and ToolPalette Demo</title>
        <link type="text/css" rel="stylesheet" href="../demo.css" />

    <!-- common, all times required, imports -->        <!--REGEXP_START_REMOVE-->
	<SCRIPT src="../../String.js"></SCRIPT>
	<SCRIPT src="../../wz_jsgraphics.js"></SCRIPT>
	<SCRIPT src="../../events.js"></SCRIPT>
	<SCRIPT src="../../debug.js"></SCRIPT>
	<SCRIPT src="../../dragdrop.js"></SCRIPT>
	<SCRIPT src="../../UUID.js"></SCRIPT>
	<SCRIPT src="../../PositionConstants.js"></SCRIPT>
	<SCRIPT src="../../Graphics.js"></SCRIPT>
	<SCRIPT src="../../Color.js"></SCRIPT>
	<SCRIPT src="../../ArrayList.js"></SCRIPT>
	<SCRIPT src="../../Point.js"></SCRIPT>
	<SCRIPT src="../../Dimension.js"></SCRIPT>
	<SCRIPT src="../../Border.js"></SCRIPT>
	<SCRIPT src="../../LineBorder.js"></SCRIPT>
	<SCRIPT src="../../Figure.js"></SCRIPT>
	<SCRIPT src="../../Node.js"></SCRIPT>
        <SCRIPT src="../../VectorFigure.js"></SCRIPT>
        <SCRIPT src="../../SVGFigure.js"></SCRIPT>
	<SCRIPT src="../../Label.js"></SCRIPT>
	<SCRIPT src="../../Oval.js"></SCRIPT>
	<SCRIPT src="../../Circle.js"></SCRIPT>
	<SCRIPT src="../../Rectangle.js"></SCRIPT>
	<SCRIPT src="../../ImageFigure.js"></SCRIPT>
	<SCRIPT src="../../Port.js"></SCRIPT>
	<SCRIPT src="../../InputPort.js"></SCRIPT>
	<SCRIPT src="../../OutputPort.js"></SCRIPT>
	<SCRIPT src="../../Line.js"></SCRIPT>
	<SCRIPT src="../../ConnectionRouter.js"></SCRIPT>
	<SCRIPT src="../../NullConnectionRouter.js"></SCRIPT>
	<SCRIPT src="../../ManhattanConnectionRouter.js"></SCRIPT>
	<SCRIPT src="../../BezierConnectionRouter.js"></SCRIPT>
	<SCRIPT src="../../FanConnectionRouter.js"></SCRIPT>
	<SCRIPT src="../../Connection.js"></SCRIPT>
	<SCRIPT src="../../ConnectionAnchor.js"></SCRIPT>
	<SCRIPT src="../../ChopboxConnectionAnchor.js"></SCRIPT>
	<SCRIPT src="../../ConnectionDecorator.js"></SCRIPT>
	<SCRIPT src="../../ArrowConnectionDecorator.js"></SCRIPT>
	<SCRIPT src="../../CompartmentFigure.js"></SCRIPT>
	<SCRIPT src="../../CanvasDocument.js"></SCRIPT>
	<SCRIPT src="../../Annotation.js"></SCRIPT>
	<SCRIPT src="../../ResizeHandle.js"></SCRIPT>
	<SCRIPT src="../../LineStartResizeHandle.js"></SCRIPT>
	<SCRIPT src="../../LineEndResizeHandle.js"></SCRIPT>
	<SCRIPT src="../../Canvas.js"></SCRIPT>
	<SCRIPT src="../../Workflow.js"></SCRIPT>
	<SCRIPT src="../../WindowFigure.js"></SCRIPT>
	<SCRIPT src="../../Button.js"></SCRIPT>
	<SCRIPT src="../../ToggleButton.js"></SCRIPT>
	<SCRIPT src="../../SnapToHelper.js"></SCRIPT>
	<SCRIPT src="../../SnapToGeometry.js"></SCRIPT>
	<SCRIPT src="../../SnapToGeometryEntry.js"></SCRIPT>
	<SCRIPT src="../../SnapToGrid.js"></SCRIPT>
	<SCRIPT src="../../ToggleButton.js"></SCRIPT>
	<SCRIPT src="../../ToolGeneric.js"></SCRIPT>
	<SCRIPT src="../../ToolPalette.js"></SCRIPT>
	<SCRIPT src="../../Dialog.js"></SCRIPT>
	<SCRIPT src="../../InputDialog.js"></SCRIPT>
	<SCRIPT src="../../PropertyDialog.js"></SCRIPT>
	<SCRIPT src="../../AnnotationDialog.js"></SCRIPT>
	<SCRIPT src="../../PropertyWindow.js"></SCRIPT>
	<SCRIPT src="../../ColorDialog.js"></SCRIPT>
	<SCRIPT src="../../LineColorDialog.js"></SCRIPT>
	<SCRIPT src="../../BackgroundColorDialog.js"></SCRIPT>
	<SCRIPT src="../../EditPartFactory.js"></SCRIPT>
	<SCRIPT src="../../AbstractObjectModel.js"></SCRIPT>
	<SCRIPT src="../../PropertyChangeEvent.js"></SCRIPT>
	<SCRIPT src="../../GraphicalViewer.js"></SCRIPT>
	<SCRIPT src="../../GraphicalEditor.js"></SCRIPT>
	<SCRIPT src="../../xmlsax.js"></SCRIPT>
	<SCRIPT src="../../xmlw3cdom.js"></SCRIPT>
	<SCRIPT src="../../XMLSerializer.js"></SCRIPT>
	<SCRIPT src="../../XMLDeserializer.js"></SCRIPT>
	<SCRIPT src="../../EditPolicy.js"></SCRIPT>

        <!-- undo/redo support (all times required too) -->
	<SCRIPT src="../../Command.js"></SCRIPT>
	<SCRIPT src="../../CommandStack.js"></SCRIPT>
	<SCRIPT src="../../CommandStackEvent.js"></SCRIPT>
	<SCRIPT src="../../CommandStackEventListener.js"></SCRIPT>
	<SCRIPT src="../../CommandAdd.js"></SCRIPT>
	<SCRIPT src="../../CommandDelete.js"></SCRIPT>
	<SCRIPT src="../../CommandMove.js"></SCRIPT>
	<SCRIPT src="../../CommandMoveLine.js"></SCRIPT>
	<SCRIPT src="../../CommandMovePort.js"></SCRIPT>
	<SCRIPT src="../../CommandResize.js"></SCRIPT>
	<SCRIPT src="../../CommandSetText.js"></SCRIPT>
	<SCRIPT src="../../CommandSetColor.js"></SCRIPT>
	<SCRIPT src="../../CommandSetBackgroundColor.js"></SCRIPT>
	<SCRIPT src="../../CommandConnect.js"></SCRIPT>
	<SCRIPT src="../../CommandReconnect.js"></SCRIPT>
	<SCRIPT src="../../Menu.js"></SCRIPT>
	<SCRIPT src="../../MenuItem.js"></SCRIPT>
	<SCRIPT src="../../mootools.js"></SCRIPT>
	<SCRIPT src="../../moocanvas.js"></SCRIPT>
        <!--REGEXP_END_REMOVE-->


        <!-- demo specific imports -->
	<SCRIPT src="MyPalette.js"></SCRIPT>
	<SCRIPT src="ToolShowGrid.js"></SCRIPT>
</head>
<body onselectstart="return false;" style="margin:0px;padding:0px;" onkeydown="">
<div id="paintarea" style="position:absolute;left:0px;top:0px;width:3000px;height:3000px" >
    <!-- The information help text -->
    <div class="stickyNote">
    <center><b>Draw2D 0.9.26 - A simple diagram drawing demo<br>
    by Andreas Herz (a.herz @ freegroup.de)
    <br>
    </b>
    <br>
    <div style="color:red;font-size:9pt"><u>Focus of this example:</u> How to use a ToggleButton.</div>
    </center>
    <br>
    <center>See more on <a href="http://www.draw2d.org">FreeGroup Draw2D 0.9.26</a></center>
    </div>

</div>
<script>
  var workflow  = new draw2d.Workflow("paintarea");
  workflow.setBackgroundImage(null,false);

  // Add a hint annotation to the workflow area
  //
  var annotation = new draw2d.Annotation("NOTE: Press the button in the Toolbar to toggle the background grid.");
  annotation.setDimension(250,70);
  workflow.addFigure(annotation,200,200);

  var dialog = new draw2d.MyPalette();
  workflow.showDialog(dialog,400,10);

</script>
</body>
</html>
